<template>
	<view class="page">
		<public-module></public-module>
		<!-- <f-navbar fontColor="#fff" :scrollTop="scrollTop" :isShowTransparentTitle="false" navbarType='5'></f-navbar> -->
		<view class="integral_total">
			<text class="total">{{integral}}</text>
			<text class="title">我的积分</text>
		</view>
		<u-list  v-if="integralLists && integralLists.length!=0" @scrolltolower="scrolltolower" height="calc(100vh - 260rpx)">
			<u-list-item v-for="(item, index) in integralLists" :key="index">
				<view class="jifenlist">
					<view class="jifen-item">
						<text class="name">{{item.remark}}</text>
						<text class="jf">{{item.type==1?'+':'-'}}{{item.integral}}</text>
					</view>
				</view>
			</u-list-item>
		</u-list>
		<u-empty mode="order" text="暂无积分记录" v-else></u-empty>

	</view>
</template>

<script>
	import base from '@/config/baseUrl';
	import fNavbar from '@/components/module/f-navbar/f-navbar';
	import {
		integral,
		integralList
	} from '@/config/api.js';
	// #ifdef MP-WEIXIN
	import {
		title
	} from 'process';
	// #endif
	export default {
		components: {
			fNavbar
		},
		data() {
			return {
				integral: 0,
				integralLists: [],
				page: 1, //页数
				isOver: 0, //是否加载完成
				isLoding: 0, //是否正在加载
			}
		},
		onLoad(option) {
			this.myIntegral();
			this.myIntegralList();
		},

		methods: {
			onJump(url) {
				uni.navigateTo({
					url: url
				})
			},
			// 我的积分
			myIntegral() {
				integral({}).then((res) => {
					if (res && res.data && res.data.article.length != 0) {
						this.integral = res.data.integral;
					}
				}).catch((err) => {
					console.log(err, 'catch')
				})
			},
			myIntegralList() {
				this.myIntegralListScrolltolower()
			},
			myIntegralListScrolltolower() {
				let _this = this;
				if (_this.isOver == 1 || _this.isLoding == 1) {
					return;
				}
				_this.isLoding = 1;
				let httpData = {
					page: _this.page,
				};
				integralList(httpData).then((res) => {
					if (res.data && res.data.data && res.data.data.length != 0) {
						_this.integralLists = _this.integralLists.concat(res.data.data);
					}
					_this.isLoding = 0;
					if (_this.page >= res.data.last_page) {
						//加载完成
						_this.isOver = 1;
					} else {
						_this.page = _this.page + 1;
					}
				}).catch((err) => {
					_this.isLoding = 0;
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #ffffff;		
	}

	.page {

		.integral_total {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			height: 260rpx;
			color: #ffffff;
			padding: 20rpx;
			background: $uni-newcolor-primary;	

			.total {
				font-size: 75rpx;
				// color: $uni-newcolor-primary;
			}

			.title {
				line-height: 2;
				font-size: 26rpx;
			}
		}

		//积分
		.jifenlist {
			display: flex;
			flex-direction: column;
			margin: 0 20rpx;

			.jifen-item {
				display: flex;
				justify-content: space-between;
				align-items: center;
				line-height: 90rpx;
				border-bottom: 1px solid #e5e5e5;
				font-size: 28rpx;

				.jf {
					font-size: 30rpx;
					color: $uni-newcolor-primary;
					font-weight: bold;
				}

			}
		}

	}
</style>